<docs>
  ## 常见问题详显
  ## props
</docs>
<template>
<div>
  <mheader @back_btn="goBack()" title="常见问题"></mheader>
  <div class="infor">
    <div class="infor-wrap">
      <p class="infor-date">{{xxx.bt}}</p>
      <div class="infor-text-wrap" v-html="xxx.wtms">
      </div>
      <div class="infor-text-wrap" v-show="textflag">
        <p class="infor-mas" v-for="(item, index) in xxx.cjwtFjs" :key="index" @click="fjlink(item.fjid)">附件：{{item.name}}</p>
      </div>
    </div>
    <div class="no-text" v-show="dataflag">暂无数据</div>
  </div>
  </div>
</template>
<script>
import Mheader from '@/ldry/group/mheader/mheader';
import $ from '@/common/js/axios';

export default {
  components: { Mheader },
  name: 'wtinfor',
  data() {
    return {
      dataflag:false,
      textflag:false,
      xxx: {}
    };
  },
  methods: {
    // 获取申请列表
    GET_reverseList() {
      this.$loading = true;
      $.get('/dafwgl/cjwt/cjwtXx',{ params: { cjwtid: this.$route.query.sqid} }).then((res) => {
        this.xxx = res.returnData.xxxx;
        this.$loading = false;
        // 暂无信息
        if (!this.xxx.znnr) {
          dataflag = true;
        }
        // 附件
          // this.xxx.cjwtFjs =[{fjid: "123", name: "说的"},{fjid: "1234", name: "说的2"}]
        if (this.xxx.cjwtFjs.length > 0) {
          textflag = true;
        }
        this.xxx.cjwtFjs.map(v=>{
          v.fjid = conf.urlPrefix + '/dafwgl/wjscxz/fjxz?cjwtFjid='+v.fjid;
          return v
        })
      }).catch(() => {});
    },
    goBack() {
      this.$router.go(-1);
    },
    fjlink(id){
      window.location.href= id
    }
  },
  created() {
    this.GET_reverseList();
  }
};
</script>
<style lang="scss" scoped>
  @import '~common/scss/variable.scss';
  .infor-text-wrap /deep/ p{
    text-indent: 0.7rem !important;
  }
  .infor-text-wrap /deep/ span{
    line-height: $line-height-base !important;
    font-size: $font-size-base !important;
  }
  .infor{
    .no-text{
      width: 984px;
      height: 300px;
      margin:84px auto 0;
      border: $border;
      background: #fff;
      text-align: center;
      line-height: 300px;
    }
    .infor-wrap{
    width: 100%;
    font-size: $font-size-base;
      .infor-date{
        font-size: $font-size-base;
        height: 66px;
        background: #D3D5DB;
        border-radius:32px;
        margin: 60px auto 40px;
        color: #3d5798;
        text-align: center;
        line-height: 0.66rem;
      }
      .infor-mas{
        height: 50px;
        line-height: 50px;
        background: #fff;
        color: #3d5798;
      }
      .infor-text-wrap{
        padding: $padding-base;
        box-sizing: border-box;
        border: $border;
        background: #fff;
      }
    }
  }
</style>
